<template>
	<div class="form-login">
		<input type="text" v-model="mobile" placeholder="请输入手机号"><br/>
		<input type="text" v-model="code" placeholder="请输入验证码"><br/>
		<button @click="getCode">获取验证码</button>
		<button @click="login">登录</button>
	</div>
</template>

<script>
export default {

  	name: 'form-login',

  	data () {
	    return {
	    	mobile: null,
	    	code: null
	    };
  	},

  	methods: {
  		getCode () {
  			this.$http.post(this.api.eabspecial, {
  				action: 'smt',
  				mobile: this.utils.enctyptStr(this.mobile)
  			}).then(
  				res => {
  					if (res.body.result === 1) {
  						alert('验证码已发送');
  					}
  				}
  			);
  		},
  		login () {
  			this.$http.post(this.api.eabspecial, {
  				action: 'smtLogin',
  				mobile: this.utils.enctyptStr(this.mobile),
  				smtcode: this.utils.enctyptStr(this.code)
  			}).then(
  				res => {
  					if (res.body.result === 1) {
  						this.$router.push({
  							name: 'home'
  						})
  					}
  				}
  			)
  		} 
  	}
};
</script>

<style lang="scss" scoped>
	.form-login{
    position: absolute;
    top: 50%;
    left: 50%;
		font-size: 32px;
		text-align: center;
		box-sizing: border-box;
    transform: translate(-50%, -50%);
		input{
			height: 50px;
			border: 1px solid #999;
			margin: 10px 0;
			font-size: 24px;
			text-align: center;
		}
	}
</style>